<%@ page language="java"   pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<title>Flexigrid</title>
</head>
<body>
<select id="changeSkin">
<option value="blue">蓝色</option><option  value="gray">银色</option>
</select><input type="button" onclick="changecss()" value="切换皮肤" /> <br>
<div style="background-color: #c2dafa;text-align:left;width: 100%">   
	   <span style="font-size: 12px">用户名：</span>   
	    <input name="username" id="username">  
	    <span style="margin-left:10px;font-size: 12px">用户密码：</span>   
	     <input name="pwd" id="pwd">  
		    <input type="button" onclick="loadGrid()" value="查询" />   
	</div>


    <table id="grdProList" style="display: none;">

    </table>
			<input id="hidden" type="hidden" name="hidden" value="null" />


	</body>
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/comstyle/flexigrid/flexigrid_blue.css" id="skin"/>
	<jsp:include page="/common/jquery.jsp"/>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/flexigrid/flexigridExtended.js"></script>
	
	<script type="text/javascript">
	
	var gird = $("#grdProList").flexigrid({
		url : '${pageContext.request.contextPath}/user/queryUserJsonUserAction.action',
		dataType: 'json',
	colModel : [
			{display: '编号', name : 'id', width : 40, sortable : false, align: 'center',hide: true},
		{display: '用户名', name : 'username', width : 180, sortable : true, align: 'center'},
		{display: '用户密码', name : 'password', width : 180, sortable : false, align: 'center'},
		{display: '创建日期', name : 'createDate', width : 180, sortable : true, align: 'center'}
		],
	buttons : [
		{name: '添加', bclass: 'add', onpress : test},
		{separator: true},
		{name: '删除', bclass: 'delete', onpress : test},
		{separator: true},
		{name: '修改', bclass: 'modify', onpress : test},
		{separator: true}
		],
	/*searchitems : [
		{display: 'ISO', name : 'iso'},
		{display: 'Name', name : 'name', isdefault: true}
		],*/
	sortname: "iso",
	sortorder: "asc",
	usepager: true,
	title: '管理员信息',
	useRp: true,
	rp: 10,// 每页默认的结果数
	rpOptions: [5,10,15,20,25,40],//可选择设定的每页结果数
	pagestat: '显示 {from} 到 {to}， 共 {total} 条记录',//显示当前页和总页面的样式
	procmsg: '正在为您努力加载中 …',//正在处理的提示信息
	nomsg: '没有数据',//无结果的提示信息
    onError: '查询出错，请刷新',
	showTableToggleBtn: true,
	width: 'auto',
	errormsg:"加载失败，请稍后再试",
	pagetext: '第',
	outof: '页,总页数',
	findtext: '查找',
	checkbox:true,//是否要多选框
	rowId:'id',//绑定行的id
	height:'auto'// 200
		});
	function test1(com, grid) {
		if (com == 'Delete') {
			confirm('Delete ' + $('.trSelected', grid).length + ' items?')
		} else if (com == 'Add') {
			alert('Add New Item');
		}
	}
	
	function test(com,grid)
	{
		if (com=='删除')
			{
				${"hidden"}.value="delete";
				if($('.trSelected',grid).length==0){
					alert("请选择要删除的数据");
				}else{
					if(confirm('是否删除这 ' + $('.trSelected',grid).length + ' 条记录吗?'))
					{
					  var  id ="";
				     for(var i=0;i<$('.trSelected',grid).length;i++){
				     //如果是最后一个被选中的
				     	if(i==$('.trSelected',grid).length-1){
				     		//id += "id="+$('.trSelected',grid).find("td:first").eq(i).text();
				     		id += $('.trSelected',grid).find("td:first").eq(i).text();
				     	} else {
				     		//id += "id="+$('.trSelected',grid).find("td:first").eq(i).text()+"&";
				     		id += $('.trSelected',grid).find("td:first").eq(i).text()+",";
				        }
				      }
				      alert(id);
				      //删除逻辑
				      //window.location.href="../InfoCategoryServlet.jsp?hidden="+${"hidden"}.value+"&"+id;
				      //刷新
				      gird.flexReload();
			      }
			   }
			}
		else if (com=='添加')
			{
				${"hidden"}.value="add";
				//跳转到添加页或弹出div添加window.location.href="infoCategroyAdd.jsp?hidden="+${"hidden"}.value;
			}
		else if (com=='修改')
		{
			${"hidden"}.value="modify";
			if($(".trSelected").length==1){
			alert(				     		id += $('.trSelected',grid).find("td:first").eq(i).text());
				//window.location.href="infoCategoryAdd.jsp?hidden="+${"hidden"}.value+"&id="+$('.trSelected',grid).find("td").eq(0).text()+"&value="+encodeURI(encodeURI($('.trSelected',grid).find("td").eq(1).text()));
			}else if($(".trSelected").length>1){
				alert("请选择一个修改,不能同时修改多个");
			}else if($(".trSelected").length==0){
				alert("请选择一个您要修改的信息")
			}
		}
	}
	
	
	function loadGrid() {
		var option = { newp: 1, extParam: [
		  { name: "password", value:  $("#pwd").val()},
                { name: "username", value: $("#username").val() }
              ]
                };
                gird.flexOptions(option).flexReload();
            }
		
		
		function changecss(key) {
			if(key == null) {
				 key = $("#changeSkin").val();
			} 
			//取得skin的css链接
			var csshref = new String($("#skin").attr("href"));
			csshref=csshref.substr(0,csshref.indexOf("flexigrid_")) + "flexigrid_" + key + ".css";
			//alert(csshref);
			csshref=$("#skin").attr("href",csshref)  //改变一下href属性其实这里已经完成
			$.cookie("css_skin",key)    //这里是记录一下cookie,防止刷新就回到原来的css路径
		}
		
		$(function()
		{
		  //如果cookie不为空的时候就读取cookie的路径
		  if($.cookie("css_skin")!=null)
		  {
		    changecss($.cookie("css_skin"));
		  }
		});
	</script>
</body>
</html>